<template>
    <div>
      <van-nav-bar
        title="修改昵称"
        left-text=""
        right-text=""
        left-arrow
        @click-left="onClickLeft"
        @click-right="onClickLeft"
      />
      <div style="text-align: left">用户名：</div>
      <div style="text-align: left"><input v-model="userName"></div>
      <hr>
      <div>以英文字母或汉字开头，限4-16个字符，一个汉字两个字符</div>
      <div @click="onSubmit">
      <van-button round block type="info" native-type="submit" style="color: black;font-weight: bold">确认
      </van-button>
      </div>
    </div>
</template>

<script>
  import axios from 'axios'
  import { Notify } from 'vant';
    export default {
        name: "updateUserName",
      data(){
          return{
            userName:sessionStorage.getItem("userName"),
            id:sessionStorage.getItem("id")
          }
      },methods:{
        onClickLeft(){
          this.$router.go(-1);
        },
        onSubmit(values) {
          axios.post("api/user/updateinformation",{id:this.id,userName:this.userName}).then(res=>{
            if(res.data.code==200){
              sessionStorage.setItem("userName",this.userName);
              this.$router.push("/information");
              Notify({ type: 'success', message: '用户名修改成功' });
            }
          })
        }
      }
    }
</script>

<style scoped>

</style>
